<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <title>费用报销列表</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="/dist/img/icon.png" type="image/x-icon">
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="/dist/plugins/bootstrap/css/bootstrap.min.css">
    <!--字体-->
    <link rel="stylesheet" href="/dist/css/font-awesome.min.css">
    <!--图标-->
    <link rel="stylesheet" href="/dist/css/ionicons.min.css">
    <link rel="stylesheet" href="/dist/plugins/fixedTable/fixed-table.css"/>
    <!--OA主样式-->
    <link rel="stylesheet" href="/dist/css/OA.min.css?t=e9c5bb62">
    <link rel="stylesheet" href="/dist/css/skins/OA-skins.min.css?t=66b457d6">
    <script src="/dist/js/pages/wreport/Template.js?t=42e28def"></script>

    <style>
        .bgOne {
            color: black;
        }

        .bgTwo {
            color: red;
        }

        .bgThree {
            color: #9d9d9d;
        }

        .fixed-table_body tr td {
            border-right: none;
            font-size: 12px;
            text-align: center;
            height: 24px;
            max-height: 24px;
            overflow: visible;
        }
        .div-td-actual-value tr td,.div-td-content-exam tr td{
            height: 29px;
            line-height: 29px;

        }
        .div-td-actual-value .td-title,.div-td-content-exam .td-title{
            color: #333;
        }
        .div-td-actual-value .td-title,.div-td-content-exam  tr:nth-of-type(odd) {
            background: #fff !important;
        }
        .div-td-actual-value .td-title,.div-td-content-exam .table-detail td {
            border-right: 1px solid #e8e8e9;
            border-bottom: 1px solid #e8e8e9;
            padding-left: 0px !important;
            padding-right: 0px !important;
            padding-top: 0px !important;
            padding-bottom: 0px !important;
            height: 29px;
            line-height: 29px;
            text-align: center;
            position: relative;
        }
        .table-detail textarea {
            height: 42px;
            width: 100%;
            line-height: 1.2em;
            resize: none;
            border-width: 0px;
            border-style: none;
            padding-left: 6px;
            padding-right: 0px !important;
            padding-top: 16px !important;
            padding-bottom: 0px !important;
            margin-left: 0px;
            margin-right: 0px !important;
            margin-top: 0px !important;
            margin-bottom: 0 !important;}
        .fixed-table_header tr th {
            border-right: none;
            background: yellow;
            font-weight: normal;
            font-size: 12px;
        }

        .fixed-table_body tr:nth-of-type(odd) {
            background: #F9F9F9;
        }

        .div-td-content-exam {
            position: absolute;
            height: auto;
            z-index: 999;
            left: -190px;
            top: 24px;
            width: 250px;
            line-height: 20px;
            background: #fff;
            border: 1px solid #e8e8ea;
            min-height: 80px;
        }
        .lineOne {
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
        }
        .div-td-content-exam i {
            width: 15px;
            height: 12px;
            background: url(/dist/img/more-icon.png);
            position: absolute;
            left: 50px;
            top: -12px;
        }
        .div-td-content-more{
            z-index: 999999;
        }
        .div-td-actual-value {
            position: absolute;
            height: auto;
            z-index: 999;
            left: -190px;
            top: 24px;
            width: 250px;
            line-height: 20px;
            background: #fff;
            border: 1px solid #e8e8ea;
            min-height: 80px;
        }
        .td-row3 {
            height: 56px !important;
            line-height: 18px !important;
            max-height: 56px;
            overflow: hidden;
        }
        .div-td-actual-value i {
            width: 15px;
            height: 12px;
            background: url(/dist/img/more-icon.png);
            position: absolute;
            left: 50px;
            top: -12px;
        }
        table td.td-tanZongStyle-line span, table td.td-tanZongStyle-line div {
            display: block;
            line-height: 25px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }
        .content {
            padding: 8px 8px 0 8px;
        }
    </style>
</head>
<body>
<section class="content" id="app" v-cloak="">
    <div class="oaLoad">
        <div class="loadGif" id="areaProgress"></div>
    </div>
    <div class="div-td-content-more"><i></i></div>
    <!--抵票情况Div-->
    <!--实际报销金额信息Div-->

    <iframe id="ifExprot" style="width:0px;height:0px;display: none;" frameborder="0"></iframe>
    <div style="height: 25px;margin-bottom: 10px;">
        <div class="pull-left" style="width: 115px;">
            <select id="selectCompany" class="form-control"
                    style="width: 100%;height: 25px;font-size: 12px;line-height: 25px;padding-top: 0px;padding-bottom: 0px;padding-left: 6px;"
                    v-model="searchParams.selectCom">
                <option value="">请选择公司</option>
                <option v-for="item in companyList" v-bind:value="item.id">{{item.name}}</option>
            </select>
        </div>
        <div class="pull-left" style="width: 127px;margin-left: 10px;">
            <select id="selectCostName" class="form-control"
                    style="height: 25px;font-size: 12px;line-height: 25px;padding-top: 0px;padding-bottom: 0px;padding-left: 6px;"
                    v-model="searchParams.selectCost">
                <option value="">请选择费用名称</option>
                <option v-for="item in costList" v-bind:value="item.id">{{item.costSmallName}}</option>
            </select>
        </div>
        <input class="pull-left form-control pull-left input-sm" type="text" v-model="searchParams.beginTime"
               @focus="showDatePicker($event)" placeholder="请选择开始时间" style="width: 106px;margin-left: 10px;">
        <input class="pull-left form-control pull-left input-sm" type="text" v-model="searchParams.endTime"
               @focus="endDatePicker($event)" placeholder="请选择结束时间" style="width: 106px;">
        <input type="text" placeholder="人员姓名" class="form-control pull-left input-sm"
               style="width: 75px; margin-left: 10px;" v-model="searchParams.userName" id="txtCoster">
        <!-- <input type="text" placeholder="费用名称" class="form-control pull-left input-sm"
                style="width: 150px; margin-left: 10px;" v-model="searchParams.costSmallName" id="txtCostSmallName">-->
        <input type="hidden" v-model="searchParams.userId">
        <button type="button" class="btn oaBtn btn-sm pull-left" style="margin-left: 10px;" @click="getList">查询</button>
        <button type="button" class="btn oaBtn btn-sm pull-left" style="margin-left: 10px;" @click="removeSelect">清空
        </button>

        <!-- <input v-if="isShowBtn('exportCost')" type="button" class="btn oaBtn btn-sm pull-right" value="导出未作废费用"
                @click="exportGet('1')"/>
         <input type="button" class="btn oaBtn btn-sm pull-right" style="margin-right: 10px;" value="导出报销费用"
                @click="exportGet('0')"/>
         <input type="button" class="btn oaBtn btn-sm pull-right" style="margin-right: 10px;" value="导出报销费用（新）"
                @click="exportGet2('0')"/>
         <input v-if="isShowBtn('exportCost')" type="button" style="margin-right: 10px;" class="btn oaBtn btn-sm pull-right" value="导出未作废费用（新）"
                @click="exportGet2('1')"/>-->
        <input type="button" class="btn oaBtn btn-sm pull-right" style="margin-right: 10px;" value="导出2"
               @click="exportGet('0')"/>
        <input  type="button" style="margin-right: 10px;" class="btn oaBtn btn-sm pull-right" value="导出"
                @click="exportGet2('0')"/>



    </div>
    <div style="height: 25px;margin-bottom: 10px;">
        <button type="button" class="btn oaBtn btn-sm pull-left" @click="getCost">报销</button>
        <button type="button" class="btn oaBtn btn-sm pull-left" style="margin-left: 10px;" @click="getCancel">撤销报销
        </button>
        <button type="button" class="btn oaBtn btn-sm pull-left" style="margin-left: 10px;" @click="getDelete">作废
        </button>
        <div style=" margin-top: 5px;width: 400px;float:left; margin-left: 12px; color: red">
            黑色字体表示未报销，红色字体表示已作废，灰色字体表示已报销
        </div>
        <div style=" margin-top: 5px;width: 200px;float:left; margin-left: 12px;">
            报销金额合计(元)： <span  style="color: red">{{checkMoney==0?'0.00':checkMoney}}</span>
        </div>
    </div>
    <div class="box-body no-padding iframeH4" id="scrollDiv">
        <div id="progress" class="wyui-progress"></div>
        <div class="fixed-table-box head-fixed " style="height: 100%">
            <div class="fixed-table_header-wraper">
                <table class="fixed-table_header" cellspacing="0" cellpadding="0" border="0">
                    <!--<table class="table table-hover  text-center" style="margin-top: 20px;">-->
                    <thead>
                    <tr>
                        <th style="width:30px;">
                            <input type="checkbox" id="checkAll" v-model="isCheckedAll" style="margin: 9px;"/>
                        </th>
                        <th style="width:40px;">
                            <div class="table-cells">序号</div>
                        </th>
                        <th style="width:60px">
                            <div class="table-cells">姓名</div>
                        </th>
                        <th style="width:90px">
                            <div class="table-cells">日期</div>
                        </th>
                        <th style="width:90px">
                            <div class="table-cells">费用名称</div>
                        </th>
                        <th style="width:90px">
                            <div class="table-cells">金额(元)</div>
                        </th>
                        <th style="width:90px">
                            <div class="table-cells">是否有发票</div>
                        </th>
                        <th>
                            <div class="table-cells">备注</div>
                        </th>
                        <th style="width:75px">
                            <div class="table-cells">抵票金额(元)</div>
                        </th>
                        <th style="width:75px">
                            <div class="table-cells">抵票情况</div>
                        </th>

                        <th style="width:75px">
                            <div class="table-cells">实际报销(元)</div>
                        </th>
                        <th style="width:120px">
                            <div class="table-cells">操作</div>
                        </th>
                    </tr>
                    </thead>
                </table>
            </div>
            <div class="fixed-table_body-wraper iframeYKFixed" style="height: 100%">
                <table class="fixed-table_body table-hover" cellspacing="0" cellpadding="0" border="0"
                       style="width: 100%;">
                    <tbody>
                    <tr v-for="(item,i) in list" :class="colors(item.bxState)">
                        <td style="width:30px;"><input  type="checkbox" @click="checked(item)"
                                                     :checked="isArray(item.id)" enabled="isEnable(item)"
                                                       v-model="item.checked"/></td>


                        <td style="width:40px;"><span>{{i+1}}</span></td>
                        <td style="width:60px;"><span>{{item.userName}}</span></td>
                        <td style="width:90px;"><span>{{formatDate((item.reportDate))}}</span></td>
                        <td style="width:90px;"><span>{{item.costSmallName}}</span></td>
                        <td style="width:90px;"><span>{{item.money}}</span></td>
                        <td style="width:90px;"><span>{{item.invoiceFlag=="1"?"有":"无"}}</span></td>
                        <td style="text-decoration: none;text-align:left" class='td-tanZongStyle-line'><i></i><span
                                class="lineOne">{{item.remark}}</span></td>
                        <td style="width: 75px">
                            <span>{{item.rushMoney=='0'?'':item.rushMoney}}</span>
                        </td>
                        <td style="width: 75px">
                            <span v-if="item.bxState=='0'&&item.invoiceFlag!='1'" :attr-type="item.id" attr-pagetype="edit"
                                  style="color:#2a8cec;cursor: pointer;text-align: center" @click="showDiv(item,'edit')"
                                  class="td-value changeValue">编辑</span>
                            <span  v-if="item.invoiceFlag!='1'&&item.bxState!='0'" :attr-type="item.id"  attr-pagetype="look"
                                   style="color:#2a8cec;cursor: pointer;text-align: center" @click="showDiv(item,'look')"
                                   class="td-value changeValue">查看</span>
                            <div class="div-td-content-exam" v-if="item.show==true">
                                <table class="table-detail">
                                    <tbody>
                                    <tr class="no-print">
                                        <td colspan="2" class=" no-print td-module">
                                            抵票信息
                                            <div class="ui_title_buttons" style="top: 0px;">
                                                <a class="ui_close" id="esc" href="javascript:void(0);" title="关闭(esc键)" @click="hideDiv(item)"
                                                   style="display: inline-block;">×</a>
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="td-title" style="background-color: #f5f5f5;">抵票名称</td>
                                        <td class="td-title" style="background-color: #f5f5f5;">金额(元)</td>
                                    </tr>
                                    <tr v-for="(item2,i2) in rushMoneyList">
                                        <td class="td-value" style="text-align: center !important;">
                                            <select v-if="rushPageType=='edit'" v-model="item2.costSmallId" @change="changeCostName(item2,i2)">
                                                <option value="">请选择</option>
                                                <option v-for="expense in expensesList" v-bind:value="expense.id">{{expense.name}}
                                            </select>
                                            <span v-else style="text-align: center"> {{item2.costSmallName}}</span>
                                        </td>
                                        <td class="td-value" style="width: 145px;color: #2a8cec;text-align: center !important;">
                                            <input v-if="rushPageType=='edit'"  class="payeeName" type="text" v-model="item2.rushOffMoney">
                                            <span v-else> {{item2.rushOffMoney}}</span>
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                                <div v-if="rushPageType=='edit'"  class="south no-print" style="height: 50px; line-height: 50px; text-align: center;margin-top: -12px;">
                                    <input type="button" value="保存" class="btn oaBtn btn-sm" @click="saveCost(item.id)">
                                </div>
                            </div>
                            <!--<input type="hidden" v-model="item.id">-->
                            <!--<input v-if="item.auditFlag" type="button" align="center"-->
                            <!--style="background-color: white;border: 0px;color: blue"-->
                            <!--@click="gotoDetail(item.id)" value="查看费用详情">-->
                        </td>

                        <td style="width: 75px">
                            <span v-if="item.bxState=='0'" :attr-type="item.id" attr-pagetype="edit"
                                  @click="showDivActual(item,'edit')"
                                  style="color:#2a8cec;cursor: pointer;text-align: center"
                                  class="td-value changeActualValue">{{item.actualBxMoney?item.actualBxMoney:(currentUser.roleName=='区域支持'?'编辑':'')}}</span>
                            <span v-if="item.bxState!='0'" :attr-type="item.id" attr-pagetype="look"
                                  @click="showDivActual(item,'look')"
                                  style="color:#2a8cec;cursor: pointer;text-align: center"
                                  class="td-value changeActualValue">

                                {{item.actualBxMoney?(item.costSmallName=='油卡加油费'?'0':item.actualBxMoney):(currentUser.roleName=='区域支持'?'查看':'')}}
                            </span>
                            <div class="div-td-actual-value"  v-if="item.showActual==true&&currentUser.roleName=='区域支持'">
                                <table class="table-detail">
                                    <tbody>
                                    <tr class="no-print">
                                        <td colspan="2" class=" no-print td-module">
                                            实际报销
                                            <div class="ui_title_buttons" style="top: 0px;">
                                                <a class="ui_close" id="actualEsc" href="javascript:void(0);" title="关闭(esc键)" @click="hideDivActual(item)"
                                                   style="display: inline-block;">×</a>
                                            </div>
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                                <table class="table-detail">
                                    <tbody>
                                    <tr>
                                        <td class="td-title" style="background-color: #f5f5f5 !important;width: 100px">报销金额(元)</td>
                                        <td class="td-title" style="background-color: #f5f5f5 !important;">说明</td>
                                    </tr>
                                    <tr>
                                        <td class="td-tanZongStyle-line" style="border-right: 1px solid #e8e8e9">
                                            <input v-if="rushPageType=='edit'" class="payeeName" style="text-align: center;color: #2a8cec" type="text"
                                                   v-model="costEntity.actualBxMoney"
                                            >
                                            <span v-else class="lineOne" style="color: #2a8cec">{{costEntity.actualBxMoney=='0'?'':costEntity.actualBxMoney}}</span>
                                        </td>
                                        <td class="td-row3" style="color: #2a8cec">
                                            <textarea v-if="rushPageType=='edit'" v-model="costEntity.actualBxCondition"></textarea>
                                            <span v-else  class="lineOne">{{costEntity.actualBxCondition}}</span>
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                                <div v-if="rushPageType=='edit'"  class="south no-print" style="height: 50px; line-height: 50px; text-align: center;margin-top: -12px;">
                                    <input  type="button" value="保存" class="btn oaBtn btn-sm" @click="saveActualRushCost(item.id)">
                                </div>
                            </div>
                            <!--<input type="hidden" v-model="item.id">-->
                            <!--<input v-if="item.auditFlag" type="button" align="center"-->
                            <!--style="background-color: white;border: 0px;color: blue"-->
                            <!--@click="gotoDetail(item.id)" value="查看费用详情">-->
                        </td>
                        <td style="width: 100px">
                            <a href="javascript:void(0);" v-if="item.auditFlag" @click="gotoDetail(item.id)"
                               style="color:#2a8cec;cursor: pointer;text-align: center">查看费用详情</a>
                            <!--<input type="hidden" v-model="item.id">-->
                            <!--<input v-if="item.auditFlag" type="button" align="center"-->
                            <!--style="background-color: white;border: 0px;color: blue"-->
                            <!--@click="gotoDetail(item.id)" value="查看费用详情">-->
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>

        </div>
        <div class="oa-pager text-center" style="margin-top: 5px;">
            共
            <span id="allCount"> 0 </span>条记录&nbsp;&nbsp;&nbsp;
            <span id="nowPage"> 1 </span>/<span id="allPage">1</span>&nbsp;&nbsp;&nbsp;
            <span class="oa-pager-button" id="first">首页</span>
            <span class="oa-pager-button" id="prev">上一页</span>
            <span class="oa-pager-button" id="next">下一页</span>
            <span class="oa-pager-button" id="last">尾页</span>
        </div>
        <!-- /.box-body -->
    </div>
</section>
<!--JQ-->
<script src="https://file.ggxqce.com/web/jquery-2.2.3.min.js"></script>
<!--插件JS-->
<script src="https://file.ggxqce.com/web/bootstrap.min.js"></script>
<script type="text/javascript" src="/dist/plugins/lhgdialog/lhgdialog.min.js?self=true"></script>

<!--框架已定义 JS-->
<script src="/dist/js/app_iframe.js?t=0b5caf39"></script>
<!--oa自定义  JS-->
<script src="/dist/js/oa.js?t=0c4d95a9"></script>
<script type="text/javascript" src="/dist/plugins/My97DatePicker/WdatePicker.js"></script>
<script src="https://file.ggxqce.com/web/vue.min.js"></script>
<script src="/dist/plugins/fixedTable/fixed-table.js"></script>
<!--  格式化钱的  JS-->
<script>
    // 注册一个局自定义指令 `v-inputOnce`
    Vue.directive('onedate', {
        // 当被绑定的元素插入到 DOM 中时……
        inserted: function (el) {
            // if($(el).hasClass("otherInput")){
            console.log(el)
            el.click()

            //     el.focus()
            //     el.blur()

            //聚焦元素

        },
        componentUpdated: function (el, binding) {
            // 聚焦元素


        }
    })
    Vue.directive('jz-fj', {
        inserted: function (el, binding) {
            console.log(el);
            app.repaymentAttachName = "";
            app.repaymentAttachUrl = "";
            app.init();

        }
    });

</script>
<script>
    //单击某一区域后蓝色Div展示原有内容
    $(function () {
        $("body").on("click", ".lineOne", function (e) {
            if ($(".div-td-content-more").is(":hidden")) {
                var text = $(this).text();
                if (text != "") {
                    text = "<i></i>" + text;
                    $(".div-td-content-more").html(text).css({
                        "width": $(this).outerWidth() + "px",
                        "left": $(this).offset().left,
                        "top": ($(this).offset().top + $(this).outerHeight()) + "px"
                    }).show();
                    e.stopPropagation();
                }
            } else {
                $(".div-td-content-more").hide();
            }
        });
        $("body").on("click", ".div-td-content-more", function (e) {
            e.stopPropagation();
        });
        $("body").on("click", function () {
            $(".div-td-content-more").hide();
        });
    });
    //点击编辑出现一个抵票信息弹框，并且传费用报销主表Id
    // $(function () {
    //     $("body").on("click", ".changeValue", function (e) {
    //         var type = $(this).attr("attr-type");
    //         var pageType = $(this).attr("attr-pagetype");
    //
    //         console.log(pageType)
    //         app.rushPageType = pageType;
    //         app.fkCostId = type;
    //         app.getCostRushList();
    //         if ($(".div-td-content-exam").is(":hidden")) {
    //             el = $(this).parent().find(".td-value")
    //             $(".div-td-content-exam").css({
    //                 "width": "250px",
    //                 "left": el.offset().left - 200 + "px",
    //                 "top": (el.offset().top + el.outerHeight()) + "px"
    //             }).show();
    //             e.stopPropagation();
    //         } else {
    //             $(".div-td-content-exam").hide();
    //         }
    //     });
    //     $("body").on("click", ".div-td-content-exam", function (e) {
    //         e.stopPropagation();
    //     });
    //     $("body").on("click", function () {
    //         $(".div-td-content-exam").hide();
    //     });
    //     $("#esc").on("click", function () {
    //         $(".div-td-content-exam").hide();
    //     });
    //
    // });
    //实际报销信息弹框
    // $(function () {
    //     $("body").on("click", ".changeActualValue", function (e) {
    //         var type = $(this).attr("attr-type");
    //         var pageType = $(this).attr("attr-pagetype");
    //         app.rushPageType = pageType;
    //         console.log(type)
    //         app.fkCostId = type;
    //         app.getCostActualRush();
    //         //app.getCostRushList();
    //         if ($(".div-td-actual-value").is(":hidden")) {
    //             el = $(this).parent().find(".td-value")
    //             $(".div-td-actual-value").css({
    //                 "width": "250px",
    //                 "left": el.offset().left - 200 + "px",
    //                 "top": (el.offset().top + el.outerHeight()) + "px"
    //             }).show();
    //             e.stopPropagation();
    //         } else {
    //             $(".div-td-actual-value").hide();
    //         }
    //     });
    //     $("body").on("click", ".div-td-actual-value", function (e) {
    //         e.stopPropagation();
    //     });
    //     $("body").on("click", function () {
    //         $(".div-td-actual-value").hide();
    //     });
    //     $("#actualEsc").on("click", function () {
    //         $(".div-td-actual-value").hide();
    //     });
    // });
</script>
<script type="text/javascript">
    function refresh() {
        $.wyui.page.getByPage();
    }
    console.log(urlConfig);
    var app = new Vue({
        el: '#app',
        data: {
            currentUser: getCurrentUser(),
            list: [],
            selectIds: [],
            checkMoney:0.00,
            fkCostId: '',
            rushPageType:'edit',
            isCheckedAll: false,
            companyList: [],
            costList: [],
            rightOp: [],//权限列表
            expensesList: [],
            rushMoneyList: [
                new Template.rushList()
            ],
            searchParams: {
                selectCom: "",
                selectCost: "",
                beginTime: "",
                endTime: "",
                userName: "",
                costSmallName: "",
                userId: getCurrentUser().id,
                currentUserId: getCurrentUser().id,
                type: "",
                load:true

            },
            costEntity: {
                actualBxCondition: "",
                actualBxMoney: ""
            }

        },
        watch: {
            isCheckedAll: function (isCheck) {
                if (isCheck) {
                    for (var i = 0; i < this.list.length; i++) {
                        var item = this.list[i];
                        //console.log("1111111111111111"+JSON.stringify(item))
                        if (item.bxState == 0) {
                            item.checked = this.isCheckedAll;
                            this.selectIds.push(item.id);
                            this.checkMoney=Number(this.checkMoney)+Number(item.money)
                        }
                    }

                } else {
                    this.selectIds = [];
                    for (var i = 0; i < this.list.length; i++) {
                        var item = this.list[i];
                        item.checked = this.isCheckedAll;

                    }
                    this.checkMoney=0.00
                }
                this.checkMoney=this.checkMoney.toFixed(2)
            }
        },
        methods: {
            showDivActual:function(item,rushPageType){
                var type = $(this).attr("attr-type");
                var that=this;
                that.rushPageType=rushPageType;
                that.getCostActualRush(item.id);
                for (var i=0;i<that.list.length;i++){
                    that.list[i].showActual=false;
                    that.list[i].show=false;
                }
                item.showActual=true;
            },
            //日期格式
            formatDate: function (now) {
//                return  NewDate(now).Format(TimeFormat.middle)
                return new Date(now).Format(TimeFormat.pcListYR);
            },
            //弹出抵票表格
            showDiv:function(item,rushPageType){
                var that=this;
                that.rushPageType=rushPageType;
                that.getCostRushList(item.id);
                for (var i=0;i<that.list.length;i++){
                    that.list[i].show=false;
                    that.list[i].showActual=false;
                }
                item.show=true;

                // var type = $(this).attr("attr-type");
                //         var pageType = $(this).attr("attr-pagetype");
                //
                //         console.log(pageType)
                //         app.rushPageType = pageType;
                //         app.fkCostId = type;
                //         app.getCostRushList();
            },
            hideDiv:function(item){
                console.log(item)
                item.show=false;
            },
            hideDivActual:function(item){
                console.log(item)
                item.showActual=false;
            },
            //格式化钱
            keyDownMoney:function (AmtStr) {
                var amtReg = /^([1-9][\d]*|0)(\.[\d]{0,2})?$/;
                var orgStr = AmtStr.value;
                var amtStr = orgStr.replace(/,/g, "");
                if (!amtReg.test(amtStr)) {
                    if (amtStr == "") {
                        $("#" + hiddenId).val("");
                        obj.val("");
                        return;
                    }
                    amtStr = $("#" + hiddenId).val();


                }
                var dox = "";//小数位
                if (amtStr.indexOf(".") != -1) {
                    dox = amtStr.substring(amtStr.indexOf("."));
                    amtStr = amtStr.substring(0, amtStr.indexOf("."));
                }


                amtStr = this.add_Qfw(amtStr);
                console.log(amtStr + dox)
                AmtStr.value=amtStr + dox;
            },
            isEnable: function (item) {
                return true;
            },
            //根据报销状态单行背景色
            colors: function(start) {
                if (start == '0') {
                    return "bgOne";
                } else if (start == '1') {
                    return "bgThree";
                } else if (start == "-1") {
                    return "bgTwo";
                }

            },
            //格式化钱
            fmoney: function(s, n) {
                n = n > 0 && n <= 20 ? n : 2;
                s = parseFloat((s + "").replace(/[^\d\.-]/g, "")).toFixed(n) + "";
                var l = s.split(".")[0].split("").reverse(), r = s.split(".")[1],
                    t = "";
                for (i = 0; i < l.length; i++) {
                    t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length ? "," : "");
                }
                return t.split("").reverse().join("") + "." + r;
            },
            strFormat: function (target, data) {
                //此结果为了展示数据
                var value = (target.value).trim();
                value = value.replace(/[^\d{1,}\.\d{1,}|\d{1,}]/g, '');
                if (!value) {
                    value = 0
                }
                ;
                //此结果为data存入数据
                var dataList = data.split('.');

                if (dataList.length > 0) {
                    if (dataList.length == 1) {
                        this[dataList[0]] = value;
                    }
                    if (dataList.length == 2) {
                        this[dataList[0]][dataList[1]] = value;
                    }
                    if (dataList.length == 3) {
                        this[dataList[0]][dataList[1]][dataList[2]] = value;
                    }
                    if (dataList.length == 4) {
                        this[dataList[0]][dataList[1]][dataList[2]][dataList[3]] = value;
                    }
                    if (dataList.length == 5) {
                        this[dataList[0]][dataList[1]][dataList[2]][dataList[3]][dataList[4]] = value;
                    }
                    if (dataList.length == 6) {
                        this[dataList[0]][dataList[1]][dataList[2]][dataList[3]][dataList[4]][dataList[5]] = value;
                    }
                }
                target.value = this.fmoney(value);
//                if (target.value == "0.00") {
//                    target.value = '';
//                }
                if (!$(target).parents("table").hasClass("sxtable")) {
                    // this.calMoney();
                }
            },
            strFormatF: function (target, data) {
                var value = '';
                var dataList = data.split('.');

                if (dataList.length > 0) {
                    if (dataList.length == 1) {
                        value = this[dataList[0]]
                    }
                    if (dataList.length == 2) {
                        value = this[dataList[0]][dataList[1]]
                    }
                    if (dataList.length == 3) {
                        value = this[dataList[0]][dataList[1]][dataList[2]]
                    }
                    if (dataList.length == 4) {
                        value = this[dataList[0]][dataList[1]][dataList[2]][dataList[3]]
                    }
                    if (dataList.length == 5) {
                        value = this[dataList[0]][dataList[1]][dataList[2]][dataList[3]][dataList[4]]
                    }
                    if (dataList.length == 6) {
                        value = this[dataList[0]][dataList[1]][dataList[2]][dataList[3]][dataList[4]][dataList[5]]
                    }

                }
                if (!value || value == '0.00') {
                    value = '';
                }
                target.value = value;
                if (target.value == "0.00") {
                    target.value = '';
                }

            },
            //保存t_wrt_cost_rush表对象(抵票信息)
            saveCost: function (id) {
                var that = this;
                console.log(that.rushMoneyList)
                $.wyui.postLoadMethod(urlConfig.wreport.wreportCost.saveOrUpdateCostRush, {
                    fkCostId: id,
                    costPush: that.rushMoneyList
                }, function (r) {
                    console.log(r);
                    top.$.alert({
                        title: '保存成功',
                        content: '',
                        icon: '1', //1成功 2失败 3提示 不穿代表无图标
                        height: 180,
                        width: 300,

                        blankclose: true,//点击空白是否可关闭
                        cancel: "确定",

                    })

                    if (that.searchParams.userName == ""&&that.searchParams.selectCom== ""&& that.searchParams.selectCost== ""&& that.searchParams.beginTime== ""&& that.searchParams.endTime== ""&& that.searchParams.costSmallName== "") {
                        that.searchParams.userId = getCurrentUser().id;
                        that.searchParams.userName = getCurrentUser().name;
                    }

                    that.getList()
                    $(".div-td-content-exam").hide();
                },false,false);

            },
            //保存t_wrt_cost表对象（实际报销）
            saveActualRushCost: function (id) {
                var that = this;
                $.wyui.postLoadMethod(urlConfig.wreport.wreportCost.saveOrUpdateCost, {
                    fkCostId: id,
                    cost: that.costEntity
                }, function (r) {
                    console.log(r);
                    top.$.alert({
                        title: '保存成功',
                        content: '',
                        icon: '1', //1成功 2失败 3提示 不穿代表无图标
                        height: 180,
                        width: 300,

                        blankclose: true,//点击空白是否可关闭
                        cancel: "确定",

                    })

                    if (that.searchParams.userName == ""&&that.searchParams.selectCom== ""&& that.searchParams.selectCost== ""&& that.searchParams.beginTime== ""&& that.searchParams.endTime== ""&& that.searchParams.costSmallName== "") {
                        that.searchParams.userId = getCurrentUser().id;
                        that.searchParams.userName = getCurrentUser().name;
                    }
                    that.getList()
                    $(".div-td-actual-value").hide();
                },false,false);

            },
            changeCostName: function (item, idx) {
                console.log(item.costSmallId)
                var that = this;
                for (var i = 0; i < that.expensesList.length; i++) {
                    if (that.expensesList[i].id == item.costSmallId) {
                        that.rushMoneyList[idx].costSmallName = that.expensesList[i].name
                    }
                }
            },
            checked: function (item) {
                var that = this;
                if ($.inArray(item.id, that.selectIds) > -1) {
                    // 如果已经包含了该id, 则去除(单选按钮由选中变为非选中状态)
                    console.log(that.selectIds.length)
                    for (var i = 0; i < that.selectIds.length; i++) {
                        if (that.selectIds[i] == item.id) {
                            that.selectIds.splice(i, 1);
                            that.checkMoney=Number(that.checkMoney)-Number(item.money)
                        }
                    }
                } else {
                    // 选中该checkbox
                    that.selectIds.push(item.id)
                    that.checkMoney=Number(that.checkMoney)+Number(item.money)
                }
                this.checkMoney=this.checkMoney.toFixed(2)
            },
            isArray: function (id) {
                var that = this;
                if ($.inArray(id, that.selectIds) > -1) {
                    // 如果已经包含了该id, 则去除(单选按钮由选中变为非选中状态)
                    return true;
                } else {
                    // 选中该checkbox
                    return false;
                }
            },
            showDatePicker: function (e) {
                var that = this;
                WdatePicker({
                    onpicked: function (dp) {
                        that.searchParams.beginTime = dp.cal.getNewDateStr();
                        return true;
                    },
                    //dateFmt:'yyyy-MM-dd HH:mm'
                });
                $(e.target).blur();
            },
            endDatePicker: function (e) {
                var that = this;
                WdatePicker({
                    onpicked: function (dp) {
                        that.searchParams.endTime = dp.cal.getNewDateStr();
                        return true;
                    },
                });
                $(e.target).blur();
            },
            isHasRightOp: function (eName) {
                return $.inArray(eName, this.rightOp) > -1;
            },
            isShowBtn: function (eName) {
                if (getCurrentUser().superUser || this.isHasRightOp(eName)) {
                    return true;
                } else {
                    return false;
                }
            },
            getList: function (e) {
                var that = this;
                $.wyui.page.queryParams.requestPage = 1;
                if (that.searchParams.userName == "") {
                    that.searchParams.userId = ""
                }
                if (that.searchParams.userName == ""&&that.searchParams.selectCom==""&&that.searchParams.selectCost==""&& that.searchParams.beginTime=="" && that.searchParams.endTime=="") {
                    that.searchParams.userId = getCurrentUser().id
                }
                var data = {
                    'companyId': that.searchParams.selectCom,
                    'beginTime': that.searchParams.beginTime,
                    'endTime': that.searchParams.endTime,
                    'userName': that.searchParams.userName,
                    'costSmallId': that.searchParams.selectCost,
                    'userId': that.searchParams.userId,
                    'currentUserId': that.searchParams.currentUserId,
                    'load':true
                };
                /*  $.extend($.wyui.page.queryParams, that.searchParams);*/
                $.extend($.wyui.page.queryParams, data);
                console.log($.wyui.page.queryParams);
                $.wyui.page.getByPage();

            },
            getCostRushList: function (id) {
                var that = this;
                $.wyui.postLoadMethod(urlConfig.wreport.wreportCost.getCostRushByFkCostId, {fkCostId: id}, function (r) {
                    console.log(r);
                    that.rushMoneyList = r;
                    that.rushListSix();
                },false,false);
            },
            getCostActualRush: function (id) {
                var that = this;
                $.wyui.postLoadMethod(urlConfig.wreport.wreportCost.getCostById, {fkCostId: id}, function (r) {
                    console.log(r);
                    that.costEntity = r.costEntity;
                    if (that.costEntity.actualBxMoney=='0'){
                        that.costEntity.actualBxMoney=''
                    }

                },false,false);
            },
            getCost: function (e) {
                var that = this;
                console.log(that.selectIds.length)
                console.log(that.selectIds);
                if (that.selectIds.length > 0) {
                    $.wyui.postLoadMethod(urlConfig.wreport.wreportCost.config, {
                        costIds: that.selectIds.join(","),
                        start: 1
                    }, function (list) {
                        alert("修改成功");
                        that.getList();
                        that.selectIds = [];
                    },false,false);
                } else {
                    alert("请勾选要报销的费用")
                }
            },
            getCancel: function (e) {
                var that = this;
                if (that.selectIds.length > 0) {
                    $.wyui.postLoadMethod(urlConfig.wreport.wreportCost.config, {
                        costIds: that.selectIds.join(","),
                        start: 0
                    }, function (list) {
                        alert("修改成功");
                        that.getList();
                        that.selectIds = [];
                    },false,false);
                } else {
                    alert("请勾选要撤销报销的费用")
                }
            },
            getDelete: function (e) {
                var that = this;
                if (that.selectIds.length > 0) {
                    $.wyui.postLoadMethod(urlConfig.wreport.wreportCost.config, {
                        costIds: that.selectIds.join(","),
                        start: -1
                    }, function (list) {
                        alert("修改成功");
                        that.getList();
                        that.selectIds = [];
                    },false,false);
                } else {
                    alert("请勾选要作废报销的费用")
                }
            },
            removeSelect: function () {
                var that = this;
                that.searchParams.beginTime = "",
                    that.searchParams.endTime = "",
                    that.searchParams.userName = "",
                    that.searchParams.costSmallName = ""

            },
            gotoDetail: function (id) {
                top.$.dialog({
                    content: 'url:/page/wreport/temporaryExpenses.html?id=' + id,
                    title: "临时费用详情",
                    width: 904,
                    height: 365,
                    max: true,
                    min: true,
                    lock: true
                });
            },
            rushListSix: function () {
                var that = this;
                for (var i = that.rushMoneyList.length; i < 6; i++) {
                    that.rushMoneyList.push(new Template.rushList())
                }
            },
            exportGet: function (type) {
                var that = this;
                if (that.selectIds.length==0){
                    alert("请勾选要导出的费用");
                    return false;
                }
                that.searchParams.type = type;
                console.log(that.searchParams.userId)
                $('#ifExprot').attr('src', server.ip
                    + urlConfig.wreport.wreportCost.getDownByCondition
                    + '?userId=' + that.searchParams.userId
                    + '&beginTime=' + that.searchParams.beginTime
                    + '&endTime=' + that.searchParams.endTime
                    + '&costIds=' + that.selectIds.join("','")
                    + '&type=' + that.searchParams.type
                )
                ;
                return false;
            },
            exportGet2: function (type) {
                var that = this;
                if (that.selectIds.length==0){
                    alert("请勾选要导出的费用");
                    return false;
                }
                that.searchParams.type = type;
                console.log(that.searchParams.userId)
                $('#ifExprot').attr('src', server.ip
                    + urlConfig.wreport.wreportCost.getDownByCondition2
                    + '?userId=' + that.searchParams.userId
                    + '&beginTime=' + that.searchParams.beginTime
                    + '&endTime=' + that.searchParams.endTime
                    + '&costIds=' + that.selectIds.join("','")
                    + '&type=' + that.searchParams.type
                )
                ;
                return false;
            }
        },
        mounted: function () {
            var that = this;
            that.rushListSix();
            /* $.wyui.postMethod(urlConfig.system.company.getCompanyList, {}, function (r) {
             console.log(r);
             that.companyList=r;
             });*/
            $.wyui.postLoadMethod(urlConfig.system.company.getCompanyByUserId, {userId: getCurrentUser().id}, function (r) {
                console.log(r);
                that.companyList = r;
            },false,false);

            $.wyui.postLoadMethod(urlConfig.system.rightOp.getRightOpByUserId, {userId: getCurrentUser().id}, function (rightOp) {
                for (var i = 0; i < rightOp.length; i++) {
                    that.rightOp.push(rightOp[i].eName);
                }
                console.log("权限列表如下：")
                console.log(that.rightOp);
                //判断用户是否有添加人员的权限
//                if (!getCurrentUser().superUser && !that.isHasRightOp('addUser')) {
//                    $("#addUserBtn").hide();
//                } else {
//                    $("#addUserBtn").show();
//                }
            },false,false);

            $.wyui.postLoadMethod(urlConfig.wreport.wreportCost.getCostSmallNameList, {}, function (r) {
                console.log(r);
                that.costList = r;
            },false,false);

            $.wyui.postLoadMethod(urlConfig.wreport.wreportCost.getAllExpensesType, {}, function (r) {
                console.log(r);
                that.expensesList = r;
            },false,false);

        }
    });
    $.wyui.page.dataUrl = server.ip + urlConfig.wreport.wreportCost.getBxByPage;
    $.wyui.page.queryParams.pageType = $.wyui.page.urlParams.pageType;
    $.wyui.page.queryParams = {
        requestPage: 1,
        pageSize: 100
    }
    $.extend($.wyui.page.queryParams, app.searchParams);
    $.wyui.page.getByPage_callback = function (records) {
        console.log(records)
        for (var i=0;i<records.length;i++){
            records[i].show=false;
            records[i].showActual=false;
        }
        app.list = records;
        document.getElementById("scrollDiv").scrollTop = 0;
    };
    $.wyui.page.getByPage_scroll_callback = function (list) {
        if (list.length < 30) {
            isLoad = false;
        } else {
            for (var i = 0; i < list.length; i++) {
                app.list.push(list[i]);
            }
            isLoad = true;
        }
    };
    //自动补全
    $(function () {

        $("#txtCoster").autoComplete({
            url: server.ip + urlConfig.system.user.getCosterTop10ByNameUserRight,
            render: function (users, panel) {
                console.log("users=" + users);
                if (users) {
                    for (var i = 0; i < users.length; i++) {
                        $("<li></li>").data("autoComplete",
                            users[i]).html("<a>" + users[i].name + "&nbsp;&nbsp;&nbsp;" +
                            "(" + "&nbsp;" + users[i].companyName + "-" + users[i].departName + "-" + users[i].roleName + "&nbsp;" + ") " + "</a>")
                            .appendTo(panel);
                    }
                }
            },
            selected: function (user) {
                console.log(user);
                app.searchParams.userId = user.id;
                app.searchParams.userName = user.name;
            },
            extraParams: {userId: getCurrentUser().id},
            height: 210,
            width: 300
        });
    }),
        //自动补全
        $(function () {
                $("#txtCostSmallName").autoComplete({
                    url: server.ip + "/wreportCost/getCosterTop10ByCostName.json",
                    render: function (users, panel) {
                        console.log("users=" + users);
                        if (users) {
                            for (var i = 0; i < users.length; i++) {
                                $("<li></li>").data("autoComplete",
                                    users[i]).html("<a>" + users[i].costName + "</a>")
                                    .appendTo(panel);
                            }
                        }
                    },
                    selected: function (user) {
                        console.log(user);
                        app.searchParams.costSmallName = user.costName;
                    },
                    height: 210,
                    width: 300
                });
            },
            Vue.directive('line-inserted', {
                inserted: function (el, binding) {
                    console.log(el);
                    var lineIndex = binding.value;
                    renderLines(el, lineIndex);
                }
            })
        );
    function selectAll() {
        var isCheck = $("#sel_1").is(':checked');  //获得全选复选框是否选中
        $("input[type='checkbox']").each(function () {
            this.checked = isCheck;       //循环赋值给每个复选框是否选中
        });
    };

</script>

<script>
    /************************滚动加载******************************/
    var divscroll = document.getElementById('scrollDiv');

    function divScroll() {
        var wholeHeight = divscroll.scrollHeight;
        var scrollTop = divscroll.scrollTop;
        var divHeight = divscroll.clientHeight;
        console.log(scrollTop + divHeight, wholeHeight)
        if (scrollTop + divHeight >= wholeHeight - 2) {
//            alert('滚动到底部了！');
            if (isLoad) {
                isLoad = false;
                setTimeout($.wyui.page.getByPage("scroll"), 1000);

            }

            //这里写动态加载的逻辑，比如Ajax请求后端返回下一个页面的内容
        }

    }

    divscroll.onscroll = divScroll;
</script>
<script>
    //初始化FixedTable
    $(".fixed-table-box").fixedTable();
</script>
</body>
</html>